@import url('https://fonts.googleapis.com/css2?family=Alegreya+SC&display=swap');
	@import url('https://fonts.googleapis.com/css2?family=Alegreya&display=swap');
	
	
	body {
		background-color: #D5D1C9;
		color: black;
		overflow-x: hidden;
		font-family: 'Alegreya SC', serif;
		display: flex;
	}
	html {
		background: #D5D1C9;
	}
	.container {
		background: #D5D1C9;
	}
	ul {
		padding-left: 0;
		margin-top: 0;
	}
	ul li {
		padding: .6em;
		list-style-type: none;
		border-radius: 9px;
		color: black;
	}
	.col-xs-4 {
		padding: 0;
	}
	li {
		display: flex;
    }
	li .one {
		width: 34%;
		color: black;
	}
	li .beforefs {
		width: 5%;
	}
	li .onefs {
		width: 35%;
		color: black;
	}
	li .threefs {
		width: 30%;
		color: black;
	}
	li .fourfs {
		width: 30%;
		color: black;
	}
	li .two {
		width: 46%;
		color: black;
	}
	li .tu {
		margin-left:2.5em;
	}
	.fspleasework{
		width: 60%;
	}
	li .three {
		width:20%;
		color: black;
	}
/*	li .four {
		width: 25%;
		color: #544E61;
		font-family: 'Alegreya', serif;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}*/
	.panel-group .panel {
		border-radius: 9px;
		box-shadow: none;
		background-color: #F0ECE4;
		margin: 5px;
	}
	.panel-default {
		border: none 
	}
	.panel-default > .panel-heading {
		padding: 0;
		border-radius: 9px;
		background-color: #F0ECE4;
		color: black;
	}
	.panel-title {
		font-size: 14px;
	}
	.panel-title > a {
		display: block;
		text-decoration: none;
		border-radius: 9px;
	}
	.more-less {
		float: right;
		padding: .5em;
		color: #544E61;
	}
	.panel-default > .panel-heading + .panel-collapse > .panel-body {
		font-family: 'Alegreya', serif;
		border-top-color: #EEEEEE;
	}
	.rotate180 {
		transform: rotate(180deg);
	}
	.purple {
		color: #544E61;
	}
	.large {
		font-size: 2em;
		padding: 5px;
	}
	.namjoon {
		border-radius: 10px;
		background-color: #F0ECE4;
		vertical-align: super;
		padding: .25em;
		width: 80%; 
		display: inline-block;
	}
	.notnamjoon {
		margin-top: 18px;
		border-radius: 10px;
		background-color: #D5D1C9;
		vertical-align: middle;
		padding: .25em;
		width: 100%; 
		display: inline-block;
	}
	.notpanel-group .panel {
		border-radius: 9px;
		box-shadow: none;
		background-color: #F0ECE4;
		margin: 5px;
	}
	.notpanel-default {
		border: none 
	}
	.notpanel-default > .panel-heading {
		padding: 0;
		border-radius: 9px;
		background-color: #F0ECE4;
		color: black;
	}
	.physical, .meaningful, .mention {
		color: #544E61;
	}
	.physical::before,
	.meaningful::before,
	.mention::before {
		content: "x";
		color: #9b87ff;
		background-color: #9b87ff;
		width:5px;
		height: 2em;
		margin-right: 10px;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	.p-tb-7.physical::before,
	.p-tb-7.meaningful::before,
	.p-tb-7.mention::before {
		padding-top: 7px;
		padding-bottom: 7px;
	}
	.meaningful::before {    
		color: #d787ff;
		background-color: #d787ff;
	}
	.mention::before {
		color: #ff87eb;
		background-color: #ff87eb;
	}
	.m-all-1 {
		margin: 1em;
	}
	.m-l-1 {
		margin-left: 1em;
	}
	.m-r-0 {
		margin-right: 0;
	}
	.m-r-1 {
		margin-right: 1em;
	}
	.m-t-1 {
		margin-top: 1em;
	}
	.m-b-1 {
		margin-bottom: 1em;
	}
	.m-b-3 {
		margin-bottom: 3em;
	}
	.m-t-3 {
		margin-top: 3em;
	}
	.m-t-5px {
		margin-top: 5px;
	}
	.text {
		display: inline;
		position: relative;
		top: -6px;
	}
	.center {
		text-align: center;
	}
	.right {
		text-align: right;
	}
	.summaryblue {
		color: #5071b4;
	}
	.fs165 {
		font-size: 1.65em;
	}
	.p-r-0 {
		padding-right: 0;
	}
	.w20 {
		width: 20%;
	}
	.w25 {
		width: 25%;
	}
	.w32 {
		width: 32%;
	}
	.books {
		display: block; 
		background-color: #aeaaa1;
		color: white;
		border-radius: 9px;
		padding-right: 15px;
		padding-left: 15px;
		margin-right: 5px;
		margin-left: 5px;
	}
	.books h4 {
		padding-top: .6em;
	}
	.books li {
		margin-left: 1em;
		padding-top: 0;
		color: white;
	}
	.top-iphone {
		display: none;
	}
	.top-fullsize {
		display: block;
	}
	.m-t-5px {
		margin-top: 5px;
	}
	.vw {
		font-size: 1vw;
	}
	.tab { margin-left: 40px; }
	.smeraldo {
		display: inline-block; 
		color: black;
		/*border-radius: 9px;
		padding-right: 15px;
		padding-left: 15px;
		padding-bottom: 15px;
		margin-right: 5px;
		margin-left: 5px;*/
	}
	.smeraldo h4 {
		padding-top: .6em;
	}
	.smeraldo li {
		margin-left: 1em;
		padding-top: 0;
		color: black;
		font-size: 12.5px;
	}
	.flowerlink a{
		color:#544E61;
	}
	.flowerlink a:hover {
		/*border-bottom: 2px solid #b676ff;*/
		text-decoration: none;
		color:  #b676ff;
		font-weight: bold;
	}
	em {
		font-style: italic;
	}
	z{
		color:#544e61;
    }
    .trlink a{
		/*border-bottom: 2px solid #b676ff;*/
		text-decoration: none;
		color:  #544e61;
		font-weight: bold;
	}
	.trlink a:hover {
		/*border-bottom: 2px solid #b676ff;*/
		text-decoration: none;
		color:  #b676ff;
		font-weight: bold;
	}
	.twtlink a:hover {
		/*border-bottom: 2px solid #b676ff;*/
		text-decoration: none;
		color:  #b676ff;
		font-weight: bold;
	}
	@media only screen and (max-width: 800px) {
		li .one {
			width: 30%;
		}
		li .two {
			width: 40%;
		}
		
		li .three {
			width:30%;
		}
		.vw {
			font-size: 1em;
		}
		.top-iphone {
			display: block;
		}
		.top-fullsize, .four {
			display: none;
		}
		li .onefs {
			width: 65%;
		}
		li .threefs {
			width: 30%;
		}
		.top-fullsize, .fourfs {
			display: none;
		}
		/*.panel-title{
			font-size: 12px;
		}*/
	}